//<li :class="tabId==1?'cur':''" @click='tab(1)'>用户名密码登录</li>
//<li :class="tabId==2?'cur':''" @click='tab(2)'>扫码登录</li>
var login = {
	props: {
		showLogin: Boolean,
	},
	template: `
	<div class="loginmodal" v-if='showLogin' @click='hidemodal'>
			<div class='logindialog'>
				<div class="w380" >
					<div class="loginEnter animated fadeInRight" v-if='loginStateMenage==1'>
						<ul class="logTitle flew">
							
							<li style='width:100%;text-align: center;'>用户登录</li>
						</ul>
						<form>
							<label><span>账号:</span> <input type="text" placeholder="请输入账号/手机号码" class="form_control" v-model='login.username'></label>
							<label><span>密码:</span> <input type="password" class="form_control" v-model='login.psw'></label>
							<label class="v_code"><span>验证码:</span> <input type="text" class="form_control" v-model='login.verificationCode'>
									<div class="code fles acc">
										<img :src="VeriCode" alt="code"> <a @click='getVeriCode'>看不清</a>
									</div>
								</label>
							<label class="acc" style="display: flex;"><input type="checkbox" v-model='login.rememberPsw'/>&nbsp;记住密码</label>
							<label><button type="button" class="btn" @click='loginfun'>登录</button></label>
							<div class="flew">
								<a @click='forgetpswTab' class="blue">忘记密码？</a>
								<a @click='registerTab' class="blue">立即注册</a>
							</div>
						</form>
					</div>

					<div class="loginEnter" v-if='loginStateMenage==2'>
						<ul class="logTitle flew">
							<li style='width:100%;text-align: center;'>注册</li>
						</ul>
						<form class='animated flipInY'>
							<label><span>手机号码:</span> <input type="text" placeholder="请输入手机号码" class="form_control" v-model='register.username'></label>
							<label><span>密码:</span> <input type="password" class="form_control" v-model='register.psw'></label>
							<label class="v_code">
							<span>验证码:</span>
							<input type="text" class="form_control" v-model='register.verificationCode' style='width:200px;'>
									<div class="code fles acc">
										<span @click='sendVeriCode' class='verificationCode' :class="verificationState?'veriColor2':'veriColor1'">{{verificationState?verificationNum+'s后再发送':'发送验证码'}}</span>
									</div>
								</label>
							<label><button type="button" class="btn" @click='registerfun'>注册</button></label>
						</form>

					</div>
					<div class="loginEnter animated flipInY" v-if='loginStateMenage==3'>
						<ul class="logTitle flew">
							<li style='width:100%;text-align: center;'>重置密码</li>
						</ul>
						<form class='animated flipInY'>
							<label><span>手机号码:</span> <input type="text" placeholder="请输入手机号码" class="form_control" v-model='forgetPsw.username'></label>
							<label><span>密码:</span> <input type="password" class="form_control" v-model='forgetPsw.psw'></label>
							<label class="v_code">
							<span>验证码:</span> 
							<input type="text" class="form_control" v-model='forgetPsw.verificationCode' style='width:200px;'>
									<div class="code fles acc">
										<span @click='sendVeriCode' class='verificationCode' :class="verificationState?'veriColor2':'veriColor1'">{{verificationState?verificationNum+'s后再发送':'发送验证码'}}</span>
									</div>
							</label>
							<label><button type="button" class="btn" @click='forgetpswfun'>确认</button></label>
						</form>
					</div>
				</div>
			</div>
		</div>
	`,
	data() {
		return {

			tabId: 1, //切换ID
			login: {
				username: '',
				psw: '',
				verificationCode: '',
				rememberPsw: ''
			}, //登录模块
			register: {
				username: '',
				psw: '',
				verificationCode: ''
			}, //注册模块
			forgetPsw: {
				username: '',
				psw: '',
				verificationCode: ''
			}, //忘记密码模块
			loginStateMenage: 1, //控制登录/注册/忘记密码框的状态 1登录2注册3忘记密码
			verificationState: false, //发送验证码的状态
			verificationNum: 60, //验证码的倒计时时间
			phoneVeriCode: '', //短信验证码
			VeriCode: '', //验证码
		}
	},
	watch: {
		showLogin: function(o, n) {
			if(o) {
				if(this.loginStateMenage == 1) {
					this.getVeriCode();
				}
			}
		}
	},
	methods: {
		//关闭模态框
		hidemodal: function(event) {
			var isModal = $(event.target).hasClass('loginmodal');
			if(isModal) {
				this.loginStateMenage = 1;
				this.initData();
				this.$emit('hidemodal', isModal);
			}
		},
		//控制登录，注册，忘记密码的切换
		tab(id) {
			this.tabId = id;
		},

		//登录
		loginfun() {
			let _this = this;
			var psw = _this.login.psw;
			if(psw) {
				psw = md5.md5(psw);
			}
			let param = {
				username: _this.login.username,
				psw: psw,
				verificationCode: _this.login.verificationCode,
				rememberPsw: _this.login.rememberPsw,
			}
			this.$emit('loginfun', param);
		},
		//切换忘记密码
		forgetpswTab() {
			this.initData();
			this.loginStateMenage = 3;
		},
		//切换注册
		registerTab() {
			this.initData();
			this.loginStateMenage = 2;
		},
		//注册按钮
		registerfun() {
			var _this = this;
			var method = 'XQJS/Register';
			var phone = _this.register.username;
			var param = {
				mobileCode: phone,
				password: md5.md5(_this.register.psw),
				securityCode: _this.register.verificationCode,
			}
			if(xq.verifyPhoneElevent(phone)) {
				if(_this.register.verificationCode == _this.phoneVeriCode) {
					xq.postUrl(method, param, function(res) {
						if(res.ErrorCode == 1) {
							xq.toast1('注册成功');
							_this.loginStateMenage = 1;
						} else {
							xq.toast1('注册失败');
						}
					});
				} else {
					xq.toast1('验证码不正确');
				}
			} else {
				xq.toast1('请输入正确的手机号码');
			}

		},
		//忘记密码按钮
		forgetpswfun() {
			var _this = this;
			var method = 'XQJS/ModifyPassword';
			var phone = _this.forgetPsw.username;
			var param = {
				mobileCode: phone,
				password: md5.md5(_this.forgetPsw.psw),
				securityCode: _this.forgetPsw.verificationCode,
			}
			if(xq.verifyPhoneElevent(phone)) {
				if(_this.forgetPsw.verificationCode == _this.phoneVeriCode) {
					xq.postUrl(method, param, function(res) {
						if(res.ErrorCode == 1) {
							xq.toast1('修改成功');
							_this.loginStateMenage = 1;
						} else {
							xq.toast1('修改失败');
						}
					});
				} else {
					xq.toast1('验证码不正确');
				}
			} else {
				xq.toast1('请输入正确的手机号码');
			}

		},
		//验证码倒计时
		sendVeriCode() {
			var _this = this;
			if(!_this.verificationState) {
				_this.getPhoneVeriCode();
			}
			//			_this.verificationState = true;
		},
		//获取手机验证码
		getPhoneVeriCode: function() {
			var _this = this;
			var param = {};
			var mobileCode = '';
			var timer1 = '';
			clearInterval(timer1);
			if(_this.loginStateMenage == 2) {
				mobileCode = _this.register.username;
				param = {
					wayType: 1,
					mobileCode: mobileCode,
				}
			} else if(_this.loginStateMenage == 3) {
				mobileCode = _this.forgetPsw.username;
				param = {
					wayType: 3,
					mobileCode: mobileCode,
				}
			}
			var method = 'XQJS/GetSecurityCode';
			if(xq.verifyPhoneElevent(mobileCode)) {
				xq.getUrl(method, param, function(res) {
					if(res.ErrorCode == 1) {
						//						_this.phoneVeriCode = res.data;//这里上线前需要修改
						_this.phoneVeriCode = 1234;
					}
				});
				timer1 = setInterval(function() {
					if(_this.verificationNum > 0 && _this.loginStateMenage != 1) {
						_this.verificationNum--;
					} else {
						clearInterval(timer1);
						_this.verificationNum = 60;
						_this.verificationState = false;
					}
				}, 1000);
				_this.verificationState = true;
			} else {
				xq.toast1('请输入正确的手机号码');
			}

		},
		//获取验证码
		getVeriCode: function() {
			var _this = this;
			var method = 'XQJS/VerifyCode';
			var param = {};
			xq.getUrl(method, param, function(res) {
				if(res.ErrorCode == 1) {
					_this.VeriCode = res.data;
				}
			});
		},
		//初始化数据
		initData: function() {
			this.login = {
				username: '',
				psw: '',
				verificationCode: '',
				rememberPsw: ''
			}; //登录模块
			this.forgetPsw = {
				username: '',
				psw: '',
				verificationCode: ''
			}; //忘记密码模块
			this.register = {
				username: '',
				psw: '',
				verificationCode: ''
			}; //注册模块
		},
	},
	mounted() {

	},
	updated: function() {

	},
}